<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ taglib prefix="spring" 	uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="tiles" 	uri="http://tiles.apache.org/tags-tiles" %>
<%@ taglib prefix="c"		uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="form" 	uri="http://www.springframework.org/tags/form" %>
<%@ page contentType="text/html; charset=utf-8" %>
<%@ page language="java" pageEncoding="utf-8"%>

<script type="text/javascript">

var validator, status;

$(document).ready(function(){
	
	   $("#tabCompaniesCard").kendoTabStrip({
	        animation:  {
	            open: {
	                effects: "fadeIn"
	            }
	        }
	    });	 
	   
	   $("#pFoundationDate").kendoDatePicker({
		   	 format: "dd.MM.yyyy"
		   	});
	   $('#pFoundationDate').attr("readonly", "readonly");
		    
	    $("#pBbossBirthDate").kendoDatePicker({
	      	 format: "dd.MM.yyyy"
	      	}); 
	    $('#pBbossBirthDate').attr("readonly", "readonly");    
	    
	    $("#pRefActivityType").kendoDropDownList();
	    $("#pRefBank").kendoDropDownList();
	    
	    $("#pRCA").kendoDatePicker({
	      	 format: "dd.MM.yyyy"
	      });
	       
	       $("#pCasco").kendoDatePicker({
	      	 format: "dd.MM.yyyy"
	      });

	    $("#btCompaniesCardReset").kendoButton({
	        icon: "cancel"
	    });
	    
	    $("#btCompaniesCardSubmit").kendoButton({
	        icon: "custom"
	    });
	    

	    $('#formCompaniesCard').submit(function(event) {
	        var form = $(this);
	        $.ajax({
	          type: form.attr('method'),
	          url: 	form.attr('action'),
	          data: form.serialize(),
	          success:function(data, textStatus, jqXHR) 
	          {
	              //data: return data from server
	              console.log("data ID" + data.id);
	              console.log("textStatus" + textStatus);
	              
		          	var returnEn = $("#returnEntity").val();
		         	if (returnEn == "ANCHETA") {
		         		parent.getRegCompanysApp (data.id);	
		         	} 
		         	
		         	if (returnEn == "CONTRACT") {
		         		parent.getRegCompanysContr(data.id);	
		         	}
		         	
	              $("#windowClientiPJCardPopup").data("kendoWindow").close();
	          },
	          error: function(jqXHR, textStatus, errorThrown) 
	          {
	              //if fails     
	        	  console.log("jqXHR" + jqXHR);
	              console.log("textStatus" + textStatus);
	          }

	        });
	        event.preventDefault(); // Prevent the form from submitting via the browser.
	      });
	    
	    validator = $("#formCompaniesCard").kendoValidator().data("kendoValidator");
	    status = 	$(".status");
	    
	    //  Set property Date and Assuranse type
	    for (var i=0;i<20;i++){
	    	$("#pAss"+i).kendoDatePicker({
	         	 format: "dd.MM.yyyy"
	         });
	    	$("#pAss"+i).attr("readonly", "readonly");
	    	$("#pAssT"+i).kendoDropDownList();
	    }
});
	
	
function SubmitFormCompaniesCard(){
	
	 if (validator.validate()) {
		 console.log("Form Is OK");
		$("#formCompaniesCard").submit();
	 } else {
    	 console.log("Form Is BAD");
		 $("#validationErrorMessageClientiPJCardPopup").text("Nu sunt completate toate cimpurile! Verificati!");
	 }
}	

function CancelFormCompaniesCard(){
	$("#windowClientiPJCardPopup").data("kendoWindow").close();
	
}


function addRowToTable() {
	var table = document.getElementById("assTable");
	var rowCount = table.rows.length;
	var row = table.insertRow(rowCount);
	var cell1 = row.insertCell(0);
	var cell2 = row.insertCell(1);
	var cell3 = row.insertCell(2);
	cell1.innerHTML = "Data expirării:";
	rowCount=rowCount-1;
	cell2.innerHTML =  		'<input id="pp'+rowCount+'.id"  name="regCompaniesAss'+rowCount+'.id"  type="hidden"/>'+ 
		 					'<input id="pAss'+rowCount+'" name="regCompaniesAss['+rowCount+'].expirationDate" style="width:150px;"  />' ;
	cell3.innerHTML = '	<select id="pAssT'+rowCount+'" name="regCompaniesAss['+rowCount+'].refAssType.id" style="width: 100px; display: none;" data-role="dropdownlist"><option value="1"  selected="selected">RCA</option><option value="2">CASCO</option><option value="3">BUNURI</option></select>'
		
	$("#pAss"+rowCount).kendoDatePicker({
    	 format: "dd.MM.yyyy"
    });	
	$("#pAssT"+rowCount).kendoDropDownList();
		 
}

function delRowFromTable(){
	var table = document.getElementById("assTable");
	var rowCount = table.rows.length;
	table.deleteRow(rowCount-1);
}

</script>

<CENTER>
<input id="returnEntity" value="${returnEntity}" type="hidden"/> 

<form:form id="formCompaniesCard" method="post" commandName="companiesItem" action="clientiPJCardPopup">
<div id="tabCompaniesCard" style="text-align: left;" >
	<ul>
	    <li class="k-state-active">
	              Persoană juridică
	    </li>
	    <li>
	              Rechizite bancare
	    </li>	
	     <li>
	              Asigurari
	    </li>	    
	</ul> 
	<div>
		<div class="k-block k-shadow">
			<ul class="forms" style="font-size: 14px;">
				<form:hidden id="pId" path="id" name="id"/>
				<li>
					<label  for="pIdno" class="required">Cod fiscal: </label> 			
					<form:input type="text" id="pIdnp" 	path="idno"  	name="idno" 	maxlength="13" style="width:150px;" class="k-textbox" required="true"/> 
				</li><li>
					<label  for="pCompanyName" class="required">Denumire firmă: </label> 
					<form:input type="text" id="pCompanyName" 	path="companyName"  name="companyName" style="width:250px;"  class="k-textbox"  required="true"/>
				</li><li>
					<label  for="pFoundationDate">Data fondarii: </label> 
					<form:input type="text" id="pFoundationDate" 			path="foundationDate"  		name="foundationDate" style="width:150px;"  class="k-textbox"/>
				</li><li>
					<label  for="pFirstName">Nume, Prenume director: </label>
					<form:input type="text" id="pBossNameSurname" path="bossNameSurname" 	name="bossNameSurname" style="width:250px;"  class="k-textbox"/>
				</li><li>
					<label  for="pBbossBirthDate">Data nasterii director: </label> 
					<form:input type="text" id="pBbossBirthDate" 			path="bossBirthDate"  		name="bossBirthDate" style="width:150px;"  class="k-textbox"/>
				</li><li>	
					<label  for="pRefActivityType" >Genul de activitate:   </label> 
					<form:select id="pRefActivityType" path="refActivityType.id" style="width:300px;"  data-required-msg="Selectati Genul de activitate" >
						<option value="-1" label=" - Selectati - " ></option>
	     					<form:options items="${refActivityTypeCBX}" itemValue="id" itemLabel="mdValue"/>
	   				</form:select>					
				</li><li>							
					<label  for="pAddress" >Adresa:  </label> 			
					<form:textarea  type="text" id="pAddress" 			path="address"  			name="address" style="width:250px;"  class="k-textbox"></form:textarea> 
				</li><li>							
					<label  for="pAddress" >Adresa juridică:  </label> 	
					<form:textarea  type="text" id="pJuridicAddress" 	path="juridicAddress"  		name="juridicAddress" style="width:250px;"  class="k-textbox" ></form:textarea> 
				</li><li>					
					<label  for="pPhoneMob" >Tel. mobil:  </label> 						
					<form:input type="text" id="pPhoneMob" 				path="phoneMob"  			name="phoneMob" 	style="width:150px;"  class="k-textbox"  />										
				</li><li>
					<label  for="pPhoneServ" >Tel. serviciu:  </label> 					
					<form:input type="text" id="pPhoneServ" 			path="phoneServ"  			name="phoneServ" 	style="width:150px;"  class="k-textbox"  />
				</li><li>							
					<label  for="pSkype" >Messenger:  </label> 							
					<form:input type="text" id="pSkype" 				path="skype"  				name="skype" 		style="width:150px;"  class="k-textbox"  /> 
				</li><li>							
					<label  for="pEmal" >E-mail:  </label> 								
					<form:input type="text" id="pEmal" 					path="emal"  				name="emal" 		style="width:150px;"  class="k-textbox"  /> 
				</li><li>							
					<label  for="pCompanySite"> Site:  </label>							
					<form:input type="text" id="pCompanySite" 			path="companySite"  		name="companySite" 		style="width:150px;"  class="k-textbox"  /> 
				</li><li>					
					<label  for="pNotes" >Commentariu:  </label> 						
					<form:textarea type="text" id="pNotes" 		path="notes"  		name="notes" 		style="width:250px;"  class="k-textbox"  ></form:textarea> 
				</li>
			</ul>	
		</div>
	</div>
	<div>
		<div class="k-block k-shadow">
			<ul class="forms" style="font-size: 14px;">
				<li>
					<label for="pRefBank"	  	>Banca:</label>		
					<form:select id="pRefBank" path="refBank.id" style="width:300px;" data-required-msg="Selectati Banca">
						<option value="-1" label=" - Selectati - " ></option>
	     					<form:options items="${refBankCBX}" itemValue="id" itemLabel="mdValue"/>
	   				</form:select>		
				</li>
				<li>
					<label for="pBankCode" >Codul băncii:</label> 			
					<form:input type="text" id="pBankCode"	  path="bankCode"  	 name="bankCode" style="width:250px;"  class="k-textbox"  />
				</li><li>
					<label for="pBankAccount" 	>Contul de decontare:</label> 	
					<form:input type="text" id="pBankAccount" path="bankAccount" name="bankAccount" style="width:250px;"  class="k-textbox" />
				</li>
				<li>
					<label for="pTVA" 	>Cod TVA:</label> 	
					<form:input type="text" id="pTVA" path="tva" name="tva" style="width:250px;"  class="k-textbox" />
				</li>
			</ul>	
		</div>		
	</div>
	<div>
		<div class="k-block k-shadow">
			<ul class="forms" style="font-size: 14px;">
					<table id=assTable>
						    <tr>
						        <th align="right">Asigurari:</th>
						    </tr>
						    <c:forEach items="${companiesItem.regCompaniesAss}" var="pp" varStatus="status1">
						        <tr>
						            <td>
						            	<label  for="pp${status1.index}.value">Data expirării:</label>
						            </td> 
						            <td>
						            	<form:hidden id="pp${status1.index}.id" path="regCompaniesAss[${status1.index}].id" name="pp${status1.index}.id"/> 
									 	<form:input  id="pAss${status1.index}"   path="regCompaniesAss[${status1.index}].expirationDate" style="width:150px;"  /> 
									 </td>
									 <td>
									 	<form:select id="pAssT${status1.index}"   path="regCompaniesAss[${status1.index}].refAssType.id" style="width:100px;" >
	     								<form:options items="${refAssTypeCBX}" itemValue="id" itemLabel="mdValue"/>
	   									</form:select>	
									 </td>
						        </tr>
						    </c:forEach>
						</table>
					
					<button id="btAdd"		type="button" onclick="addRowToTable();" 	>Adaugă</button>
					<button id="btAdd"		type="button" onclick="delRowFromTable();" 	>Elimina</button>
				
				</ul>
		</div>		
	</div>	
	
</div>
<p style="text-align: right;">
	<span id="validationErrorMessageClientiPJCardPopup" class="status" style="color: red; float: left;"></span>
	<button id="btCompaniesCardSubmit" 	type="button" onclick="SubmitFormCompaniesCard()"  >Salvează</button>
	<button id="btCompaniesCardReset" 	type="reset"  onclick="CancelFormCompaniesCard();">Anulează</button>
</p> 
</form:form> 
    
    
</CENTER>
<style scoped>
     #formCompaniesCard ul {
         list-style-type: none;
         margin: 0;
         padding: 0;
     }
     #formCompaniesCard li {
         margin: 10px 0 0 0;
     }

     label {
         display: inline-block;
         width: 300px;
         text-align: right;
     }
     
     input {
     	height: 10px;
     }

     .required {
         font-weight: bold;
     }

     .accept, .status {
         padding-left: 90px;
     }

     .valid {
         color: green;
     }

     .invalid {
         color: red;
     }
     span.k-tooltip {
         margin-left: 6px;
     }
 </style>